import { UiButton } from "@/shared/Uikit"
import { Modal, ModalBody, ModalContent, useDisclosure } from "@nextui-org/react"
import UiCreateLessonForm from "./UiCreateLessonForm"

type CreateLessonBtnProps = {
    themeId: number
    onSuccess?:()=>void
}


export function CreateLessonButton(props: CreateLessonBtnProps) {
    const { isOpen, onOpenChange, onOpen } = useDisclosure()

    return <>
        <UiButton
            onClick={onOpen}
            variant='primary'
        >
            Создать урок
        </UiButton>
            <Modal
                className=' fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bottom-0 h-fit bg-white p-5 rounded-lg'
                isOpen={isOpen}
                onOpenChange={onOpenChange}
            >
                <ModalContent className='w-1/2'>
                    {(onClose) => (
                        <>
                            <ModalBody className='p-5 items-center'>
                                <div className='w-full ' >
                                    <UiCreateLessonForm
                                        themeId={props.themeId}
                                        onSuccess={()=>{
                                            if(props.onSuccess)
                                            props.onSuccess()
                                            onClose()
                                        }}
                                    />
                                </div>
                            </ModalBody>
                        </>
                    )}
                </ModalContent>
            </Modal>
    </>
}